<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Change location and point of view - ExtStreetviewControl</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxQGj0PqsCtxKvarsoS-iqLdqZSKfxRdmoPmGl7Y9335WLC36wIGYa6o5Q" type="text/javascript"></script>
    <script type="text/javascript">
    document.write('<script type="text/javascript" src="../src/extstreetviewcontrol'+(document.location.search.indexOf('packed')>-1?'_packed':'')+'.js"><'+'/script>');
  </script>
    <script type="text/javascript">

    var extStreetviewControl = null;
    function initialize () {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(48.859862, 2.292024), 17);
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        map.addOverlay(new GStreetviewOverlay());

        var opts_ = {
                      pov : {yaw:500, pitch:-10, panoId:null}
                    };
        extStreetviewControl = new ExtStreetviewControl(opts_);
        map.addControl(extStreetviewControl);
      }
    }
    
    function show_La_tour_Eiffel() {
      var pos = new GLatLng(48.859862, 2.292024);
      var pov = {
        yaw : 500,
        pitch : -10
      };
      extStreetviewControl.setLocationAndPOV(pos, pov);
    }
    
    function show_Arc_de_triomphe_de_l_Etoile() {
      var pos = new GLatLng(48.874165, 2.294003);
      var pov = {
        yaw : 118.55260681118132,
        pitch : -10
      };
      extStreetviewControl.setLocationAndPOV(pos, pov);
    }
    
    function show_Parvis_Notre_Dame() {
      var pos = new GLatLng(48.853563, 2.348562);
      var pov = {
        yaw : 495.7697545746159,
        pitch : -10
      };
      extStreetviewControl.setLocationAndPOV(pos, pov);
    }
    </script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 100%; height: 80%"></div>
    <h4>Change location and point of view</h4>
    <p>
    You can control the view of streetview.
    </p>
    <input type="button" onclick="show_La_tour_Eiffel();" value="La tour Eiffel"><br>
    <input type="button" onclick="show_Arc_de_triomphe_de_l_Etoile();" value="Arc de triomphe de l'Etoile"><br>
    <input type="button" onclick="show_Parvis_Notre_Dame();" value="Parvis Notre Dame"><br>

  </body>
</html>

